<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>淘房 - 注册</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="${path}/plugins/bootstrap-3.3.7-dist/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${path}/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="${path}/css/custom.css" rel="stylesheet">
    <link href="${path}/css/animate.css" rel="stylesheet">
    <link href="${path}/css/style.css?v=4.1.0" rel="stylesheet">
    <script>if (window.top !== window.self) {
        window.top.location = window.location;
    }</script>

    <style>
        .gray-bg{
            margin: 0;
            padding: 0;
            font-family: sans-serif;
            background: url(http://${path2}/img/loginimg2.jpg)  no-repeat center 0px;
            background-size: cover;

            background-position: center 0;
            background-repeat: no-repeat;
            background-attachment: fixed;
            -webkit-background-size: cover;
            -o-background-size: cover;
            -moz-background-size: cover;
            -ms-background-size: cover;

        }
    </style>

</head>

<body class="gray-bg">

<div class="middle-box text-center loginscreen animated fadeInDown">
    <div style="margin-top: 30%"></div>
    <h3>欢迎注册 淘房</h3>
    <p>创建一个淘房新账户</p>
    <form id="register" class="m-t" role="form" method="post">
        <div class="form-group">
            <input type="text" class="form-control" name="account" id="account" placeholder="请输入用户名" required=""
                   onblur="checkName()" onfocus="checkName2()">
            <span id="account_id">请输入用户名</span>
        </div>
        <div class="form-group">
            <input type="password" class="form-control" name="password" id="password" placeholder="请输入密码" required=""
                   onblur="checkPwd()" onfocus="checkPwd1()">
            <span id="password_id1">请输入密码</span>
        </div>
        <div class="form-group">
            <input type="password" class="form-control" name="password2" id="password2" placeholder="请再次输入密码"
                   required="" onblur="checkPwd2()" onfocus="checkPwd3()">
            <span id="password_id2">请再次输入密码</span>
        </div>
        <div>
            <label for="register">选择身份</label>
            <select class="form-control" name="identity" id="identity">
                <option>租客</option>
                <option>经纪人</option>
                <option>房东</option>
            </select>
        </div>
        <br>
        <div class="form-group text-left">
            <div class="checkbox i-checks">
                <label class="no-padding"><input type="checkbox" name="ck_content" value="1" id="check"/>
                    我同意注册协议</label>
            </div>
        </div>
        <input type="button" id="my_button" class="btn btn-primary block full-width m-b" onclick="checkeds()"
               value="注 册">

        <p class="text-muted text-center"><small>已经有账户了？</small><a href="${path}/login/check">点此登录</a></p>

    </form>
</div>

<script>


    function checkName() {
        let name = $("#account").val();
        let datas = {"account": name}
        $.post('${path}/register/checkaccount', datas, function (data) {
            if (data.code == 200) {
                let account_id = document.getElementById("account_id")
                account_id.style.display="inline"
                account_id.innerText = "用户名可用"
            } else {
                account_id.innerText = "用户名已存在"
                $("#my_button").attr('disabled', true);
                $("#password").attr('disabled', true);
                $("#password2").attr('disabled', true);
            }
        })
    }
    function checkName2() {
        let account_id = document.getElementById("account_id")
        account_id.style.display="none"
        $("#my_button").attr('disabled', false);
        $("#password").attr('disabled', false);
        $("#password2").attr('disabled', false);

    }

    function checkPwd() {
        let pwd = $("#password").val();
        if (pwd != "") {
            if (!(/^[a-zA-Z0-9]{6,8}$/.test(pwd))) {
                document.getElementById("password_id1").innerText = "密码不合法,必须为6-8位，可包含数字，大小写字母"
                $("#my_button").attr('disabled', true);
                $("#password2").attr('disabled', true);
            } else {
                let password_id1= document.getElementById("password_id1")
                password_id1.style.display="inline"
                password_id1.innerText = "密码可用"
            }
        } else {
            password_id1.innerText = "密码不能为空"
            $("#my_button").attr('disabled', true);
            $("#password2").attr('disabled', true);
        }

    }
    function checkPwd1() {
        let password_id1= document.getElementById("password_id1")
        password_id1.style.display="none"
        $("#my_button").attr('disabled', false);
        $("#password2").attr('disabled', false);
    }



    function checkPwd2() {
        let pwd2 = $("#password2").val();
        let pwd = $("#password").val();
        if (pwd2 != "") {
            if (pwd2 != pwd) {
                document.getElementById("password_id2").innerText = "两次密码不一致"
                $("#my_button").attr('disabled', true);

            } else {

                let password_id2= document.getElementById("password_id2")
                password_id2.style.display="inline"
                password_id2.innerText = "密码一致"
            }
        } else {
            password_id2.innerText = "密码不能为空";
            $("#my_button").attr('disabled', true);
        }
    }

    function checkPwd3() {
        let password_id2= document.getElementById("password_id2")
        password_id2.style.display="none"
        $("#my_button").attr('disabled', false);
    }


    function checkeds() {
        let name = $("#account").val();
        let pwd2 = $("#password2").val();
        let pwd = $("#password").val();
        let identity = $("#identity").val();
        let datas = {"account": name, "password": pwd, "identity": identity}
        let cks = document.getElementsByName("ck_content");
        let count = 0;

        for (let i = 0; i < cks.length; i++) {
            if (cks[i].checked) {
                count++;
            }
        }
        if (count == 0) {
            alert("请确认协议")
            // $("#my_button").attr('disabled', true);
        } else {

            window.location = '${path}/register/adduser/' + name + '/' + pwd + '/' + identity;


            // $("#my_button").attr('disabled', false);
            // $.ajax({
            //     type:'post',
            //     url:'${path}/register/adduser',
            //     data:datas,
            //     contentType:'application/json;charset=utf-8',
            //     success:function(data){
            //         alert("=====")
            //         window.location.href='${path}/register/adduser'+datas;
            //     }
            // })

            // $.get("${path}/register",datas,function (data) {
            //     console.log(data)
            // })

        }

    }

    // function checkAll() {
    //     alert('1')
    //     alert(checkName())
    //     if (checkName()){alert('2')
    //         if (checkPwd()){alert('3')
    //             if (checkPwd2()){alert('4')
    //                 checked()
    //             }
    //         }
    //     }
    // }
    // function checkname() {
    //     let name = $("#account").val();
    //     let datas = {"account":name}
    //
    //     $.post('${path}/register/checkaccount', datas, function (data) {
    //         if(data.code==200){
    //             document.getElementById("account_id").innerText="用户名可用"
    //
    //             let pwd = $("#password").val();
    //
    //             if (pwd!=""){
    //                 if(!(/^[a-zA-Z0-9]{6,8}$/.test(pwd))){
    //                     document.getElementById("password_id1").innerText="密码不合法,必须为6-8位，可包含数字，大小写字母"
    //
    //                     let pwd2 = $("#password2").val();
    //
    //                     if (pwd2!=""){
    //                         if (pwd2!=pwd){
    //                             document.getElementById("password_id2").innerText="两次密码不一致"
    //
    //
    //                         }else {
    //                             document.getElementById("password_id2").innerText="密码一致"
    //
    //                             let cks = document.getElementsByName("ck_content");
    //                             let count = 0;
    //                             for (let i = 0; i < cks.length; i++) {
    //                                 if (cks[i].checked){
    //                                     count++;
    //                                 }
    //                             }
    //                             if (count==0){
    //                                 alert("请确认协议")
    //                             }else {
    //                                 $.ajax({
    //                                     type:'post',
    //                                     url:'${path}/register/adduser',
    //                                     data:datas,
    //                                     contentType:'application/json;charset=utf-8',
    //                                     success:function(data){
    //                                         window.location.href='${path}/register/adduser';
    //                                     }
    //                                 })
    //                             }
    //
    //                         }
    //                     }else {
    //                         document.getElementById("password_id2").innerText="密码不能为空"
    //
    //                     }
    //
    //                 } else {
    //                     document.getElementById("password_id1").innerText="密码可用"
    //
    //                 }
    //             }else {
    //                 document.getElementById("password_id1").innerText="密码不能为空"
    //
    //             }
    //
    //         }else {
    //             document.getElementById("account_id").innerText="用户名已存在"
    //
    //         }
    //     })
    // }


</script>

<script src="${path}/plugins/jquery-3.4.1.js"></script>
<script src="${path}/plugins/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!-- register注册功能 -->

</body>
</html>